<template>
    <el-scrollbar class="container">
        <diy-goods-cate v-if="name_c == 'goods_cate'" />
        <grid v-if="name_c == 'grid'"/>
        <banner v-if="component?.info?.name == 'banner'"/>
        <image-list v-if="name_c == 'image'"/>
        <article-list v-if="name_c == 'article'" />
        <search v-if="name_c == 'search'" />
        <diy-header v-if="name_c == 'header'" />
        <diy-goods v-if="name_c == 'goods'" />
        <sell-card v-if="name_c == 'sell_card'" />
        <diy-page v-if="index_c == -1" />
        <tab-bar v-if="index_c == -2" />
    </el-scrollbar>

</template>

<script setup lang="ts">

import Grid from "@/views/site/diy/components/Right/Grid.vue";
import {computed, inject} from "vue";
import Banner from "@/views/site/diy/components/Right/Banner.vue";
import ImageList from "@/views/site/diy/components/Right/ImageList.vue";
import ArticleList from "@/views/site/diy/components/Right/ArticleList.vue";
import Search from "@/views/site/diy/components/Right/Search.vue";
import DiyGoods from "@/views/site/diy/components/Right/DiyGoods.vue";
import DiyPage from "@/views/site/diy/components/Right/DiyPage.vue";
import SellCard from "@/views/site/diy/components/Right/SellCard.vue";
import TabBar from "@/views/site/diy/components/Right/TabBar.vue";
import DiyHeader from "@/views/site/diy/components/Right/DiyHeader.vue";
import DiyGoodsCate from "@/views/site/diy/components/Right/DiyGoodsCate.vue";

const component : any = inject("selectedComponent")

const name_c : any = computed(() => {
    return component?.info?.name
})
const index_c : any = computed(() => {
    return component?.index
})

</script>

<style scoped lang="scss">
.container{
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
}
</style>
